<html>
<head>
	<link type="text/css" rel="stylesheet" href="themes/${theme}/forms.css" />

	<script type="text/javascript" src="js/jquery.js"></script>
	<script type='text/javascript' src='js/jquery.autocomplete.js'></script>
	<script type="text/javascript" src="js/jquery.validate.js"></script>
	<script type="text/javascript" src="js/jquery.form.js"></script>
	<script type="text/javascript">
	$(document).ready(function() {
		// form validation
		$("#project_modify").validate({
			rules: {
				project_name: {
					required: true,
					remote: {
						url: "services/check_project_name.php?id=${id}",
						type: "get",
						data: {
							project: function() {
								return $("#project_name").val();
							}
						}
					}
				},
				your_role: {
					required: true
				},
				project_description: {
					required: true
				}
			},
			messages: {
				project_name: {
					required: '<font color="#FF0000">${name_required}</font>',
					remote: '<font color="#FF0000">${name_remote}</font>'
				},
				your_role: {
					required: '<font color="#FF0000">${role_required}</font>'
				},
				project_description: {
					required: '<font color="#FF0000">${desc_required}</font>'
				}
			}
		});

		$("#project_modify").submit(function(){
			$(this).ajaxSubmit();
			return false;
		});

                // Save buttom
                $("#save").click(function(){
			if ($("#project_modify").valid() == true) {
				$("#project_modify").submit();
				$.nyroModalRemove();
				document.location.reload(true);
			}
                }).mouseover(function(){
                        $(this).css("cursor","pointer");
                });

		// Cancel button
		$("#cancel").click(function(){
			$.nyroModalRemove();
		}).mouseover(function(){
			$(this).css("cursor","pointer");
		});

		$("#project_name").focus();
	})
	</script>
</head>
<body>
<form action="project_modify.php" method="post" id="project_modify" name="project_modify">
<input type="hidden" name="id" id="id" value="${id}" />
<table width="480" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
	<td rowspan="3" class="form_left" width="20">&nbsp;</td>
	<td height="20" class="form_title">&nbsp;${title}</td>
</tr>
<tr>
	<td>
	<table width="95%" border="0" cellpadding="1" cellspacing="1" align="center">
	<tr>
		<td align="right" height="20">${prj_name}:&nbsp;</td>
		<td width="176"><input type="text" name="project_name" id="project_name" class="form_input" value="${txt_prjname}" /></td>
	</tr>
	<tr>
		<td align="right" height="20">${yrole}&nbsp;</td>
		<td width="176">
			<select id="your_role" name="your_role" class="form_input"> 
				<option tal:repeat="rol roles" value='${rol/id_role}'>${rol/name}</option>
			</select>
		</td>
	</tr>
	<tr>
		<td colspan="2" align="center" height="20">${description}</td>
	</tr>
	<tr>
		<td colspan="2" align="center">
			<textarea class="form_textarea" id="project_description" name="project_description">${txt_prjdesc}</textarea>
		</td>
	</tr>
	<tr>
		<td align="right">${dt_start}&nbsp;</td>
		<td><input type="text" name="project_beginning" id="project_beginning" class="form_input" maxlength="10" value="${txt_prjdate}"/></td>
	</tr>
	<tr>
		<td colspan="2" class="form_separator">&nbsp;</td>
	</tr>
	</table>
	<table width="99%" border="0" cellpadding="1" cellspacing="1">
		<tr>
			<td align="right" height="40">
				<img src="themes/${theme}/images/btn_save.jpg" border="0" id="save" />
			</td>
			<td width="65">
				<img src="themes/${theme}/images/btn_cancel.jpg" border="0" id="cancel" />
			</td>
		</tr>
	</table>
	</td>
	</tr>
</table>
</form>
</body>
</html>

